<template>
	<view class="center-container">
		<block v-for="(item,index) in tpl[userRid].card" :key="index">
			<sh-userinfo v-if="item.type=='user-info'" :detail="userInfoBg" :role="userRid"></sh-userinfo>
			<sh-dealerinfo v-if="item.type=='dealer-info'"></sh-dealerinfo>
			<sh-order v-if="item.type=='order-info'" :detail="[]"></sh-order>
			<sh-height v-if="item.type=='height'" :height="item.content.height"></sh-height>
		</block>
		<view class="center-data grid-table">
			<view v-for="(item,index) in tpl[userRid].apps" :key="index" class="grid-item" @tap="jump(item.path)">
				<view class="iconfont" :class="[item.icon]" :style="{color:item.color}"></view>
					{{item.title}}
			</view>
			<view class="grid-item-empty"></view>
			<view class="grid-item-empty"></view>
			<view class="grid-item-empty"></view>
		</view> 
		
		<!-- <view v-if="userRid==9" class="center-data grid-table">
			<view class="grid-item" @tap="jump('/pages/app/dealer/beVIP',{})">
				<view class="iconfont icon-xiangmu" style="color:#fdc816"></view>
				成为VIP
			</view>
			<view class="grid-item" @tap="jump('/pages/user/address/list',{})">
				<view class="iconfont icon-icon_order" style="color:#67b8ef"></view>
				收货地址
			</view>			
			<view class="grid-item" @tap="jump('/pages/public/kefu/index')">
				<view class="iconfont icon-kefu" style="color:#ff8560"></view>
				联系客服
			</view>
			<view class="grid-item">
				<view class="iconfont icon-dengji" style="color:#b498fc"></view>
				分润说明
			</view>
			<view class="grid-item">
				<view class="iconfont icon-caiwu" style="color:#6fd492"></view>
				常见问题
			</view> 
			<view class="grid-item"> 
				<view class="iconfont icon-paihangbang" style="color:#6dd693"></view>
				关于我们
			</view>
			<view class="grid-item" @tap="jump('/pages/user/set',{})">
				<view class="iconfont icon-shuben" style="color:#fe9500"></view>
				个人设置
			</view>
			<view class="grid-item" @tap="jump('/pages/user/set',{})">
				<view class="iconfont icon-h" style="color:#fe816b"></view>
				退出登录
			</view>
			<view class="grid-item-empty"></view>
			<view class="grid-item-empty"></view>
			<view class="grid-item-empty"></view>
		</view> -->
		
		<!-- <view v-if="userRid==10" class="center-data grid-table">
			<view class="grid-item" @tap="jump('/pages/app/dealer/myProductList',{})">
				<view class="iconfont icon-xiangmu" style="color:#fe816b"></view>
				产品海报
			</view>
			<view class="grid-item" @tap="jump('/pages/app/dealer/myBenefit',{})">
				<view class="iconfont icon-caiwu" style="color:#a689fd"></view>
				收益记录
			</view>
			<view class="grid-item" @tap="jump('/pages/app/dealer/myCustomerList',{})">
				<view class="iconfont icon-schedule" style="color:#6dd693"></view>
				我的会员
			</view>
			<view class="grid-item" @tap="jump('/pages/app/dealer/inviteUser',{})">
				<view class="iconfont icon-tuanduixiezuo" style="color:#5eb7f1"></view>
				邀请注册
			</view>
			<view class="grid-item" @tap="jump('/pages/app/dealer/beCooper',{})">
				<view class="iconfont icon-zhuanti" style="color:#fdc816"></view>
				成为合伙人
			</view>
			<view class="grid-item">
				<view class="iconfont icon-wodedaipingjia" style="color:#6fd492"></view>
				常见问题
			</view>			
			<view class="grid-item" @tap="jump('/pages/public/kefu/index')">
				<view class="iconfont icon-kefu" style="color:#ff8560"></view>
				联系客服
			</view>
			<view class="grid-item" @tap="jump('/pages/user/set',{})">
				<view class="iconfont icon-buoumaotubiao06" style="color:#fe9500"></view>
				个人设置
			</view>
			<view class="grid-item-empty"></view>
			<view class="grid-item-empty"></view>
			<view class="grid-item-empty"></view>
		</view> -->
		
		<!-- <view v-if="userRid==11" class="center-data grid-table">
			<view class="grid-item" @tap="jump('/pages/app/dealer/myProductList',{})">
				<view class="iconfont icon-xiangmu" style="color:#fe816b"></view>
				产品海报
			</view>
			<view class="grid-item" @tap="jump('/pages/app/dealer/myBanlance',{})">
				<view class="iconfont icon-zijinzhangbian" style="color:#ff8560"></view>
				预存货款
			</view>
			<view class="grid-item" @tap="jump('/pages/app/dealer/myBenefit',{})">
				<view class="iconfont icon-caiwu" style="color:#a689fd"></view>
				收益记录
			</view>
			<view class="grid-item" @tap="jump('/pages/app/dealer/myCustomerList',{})">
				<view class="iconfont icon-schedule" style="color:#6dd693"></view>
				我的会员
			</view>
			<view class="grid-item" @tap="jump('/pages/app/dealer/inviteUser',{})">
				<view class="iconfont icon-tuanduixiezuo" style="color:#5eb7f1"></view>
				邀请注册
			</view>
			<view class="grid-item">
				<view class="iconfont icon-wodedaipingjia" style="color:#6fd492"></view>
				常见问题
			</view>			
			<view class="grid-item" @tap="jump('/pages/public/kefu/index')">
				<view class="iconfont icon-kefu" style="color:#ff8560"></view>
				联系客服
			</view>
			<view class="grid-item" @tap="jump('/pages/user/set',{})">
				<view class="iconfont icon-buoumaotubiao06" style="color:#fe9500"></view>
				个人设置
			</view>
			<view class="grid-item-empty"></view>
			<view class="grid-item-empty"></view>
			<view class="grid-item-empty"></view>
		</view> -->
	
		<!-- 商城运营商 -->
		<!-- <view v-if="userRid==12" class="center-data grid-table">
			<view class="grid-item" @tap="jump('/pages/order/listS',{})">
				<view class="iconfont icon-xiangmu" style="color:#fdc816"></view>
				订单
			</view>
			<view class="grid-item" @tap="jump('/pages/goods/list',{})">
				<view class="iconfont icon-icon_order" style="color:#67b8ef"></view>
				预存货款
			</view>
			<view class="grid-item" @tap="jump('/pages/app/dealer/myCooperBenefit',{})">
				<view class="iconfont icon-shuben" style="color:#fe9500"></view>
				我的会员
			</view>
			<view class="grid-item" @tap="jump('/pages/app/dealer/subcustomers',{})">
				<view class="iconfont icon-kehuC" style="color:#ff8560"></view>
				邀请注册
			</view>
			<view class="grid-item">
				<view class="iconfont icon-dengji" style="color:#b498fc"></view>
				常见问题
			</view>
			<view class="grid-item">
				<view class="iconfont icon-caiwu" style="color:#6fd492"></view>
				联系客服
			</view> 
			<view class="grid-item" @tap="jump('/pages/app/dealer/subcustomers',{})">
				<view class="iconfont icon-school" style="color:#5eb7f1"></view>
				个人设置
			</view>
			<view class="grid-item-empty"></view>
			<view class="grid-item-empty"></view>
			<view class="grid-item-empty"></view>
		</view> -->
			
		<!-- <view class="footer">
			<view class="footer-item">
				<view class="iconfont icon-shouye"></view>
				后台
			</view>
			<view class="footer-item" @tap="jump('/pages/app/dealer/index',{})">
				<view class="iconfont icon-denglu"></view>
				分销
			</view>
			
		</view> -->
		
		<shopro-dealer-tabbar></shopro-dealer-tabbar>
	</view>
</template>

<script>

import shUserinfo from '@/pages/index/components/sh-userinfo-c.vue';
import shOrder from '@/pages/index/components/sh-order.vue';
import shHeight from '../../index/components/sh-height.vue';
import shDealerinfo from '../../index/components/sh-dealerinfo.vue';
import shoproDealerTabbar from '@/components/shopro-dealer-tabbar/shopro-dealer-tabbar';
import { mapMutations, mapActions, mapState } from 'vuex';
export default {
	components: {
		shUserinfo,shOrder,shHeight,shDealerinfo
	},
	data() {
		return {
			userInfoBg:{
				color:'background-color: rgb(238, 238, 238);',
				image:'https://shopro-1253949872.file.myqcloud.com/uploads/20200704/3fd138c2e95f80ecc11eebe312ffce94.png'
			},
			userInfo:{},
			tpl:"",
			userRid:0,
			userRidTable:{
				"Label_B":11,
				"Label_bb":10,
				"Label_C":9,
				"Lable_S":12
			}
		};
	},
	computed: {
		
	},
	onPullDownRefresh() {
	},
	mounted(){
		let user=uni.getStorageSync("userInfo");
		console.log(user);
		
		if(user==''){
			this.jump("/pages/public/login");
		}
		
		
	},
	onLoad() {
		let userInfo=uni.getStorageSync("userInfo");
		if(!userInfo)return;
		this.userInfo=JSON.parse(userInfo);
		
		uni.request({
			url: this.$config.Distribute_URL+"rerole_label/?dbname=Retail_Store"+this.userInfo.StoreUserInfo.StoreId+"&userid="+this.userInfo.StoreUserInfo.Uid,
			method:"GET",
			success: (result) => {			
				console.log(result.data);
				let userrid=this.userRidTable[result.data];
				this.userRid=userrid||this.userRid;
			},
			fail:(error)=>{
				console.log("身份服务错误");
				this.userRid=this.userInfo.StoreUserInfo.UserRid;
			}
		})
		
		uni.request({
		    url: this.$config.API_URL+"Distribute/GetDistributePageConfigByDomain",
			method:"POST",
			data:{
				"domain":encodeURIComponent(window.location.host)
			},
			success: (result2) => {
				this.tpl=result2.data.usercenter;
				console.log(this.userRid);
				console.log(this.tpl);
				console.log(this.tpl[this.userRid]);
			}
		})
		
	},
	onShow() {

	},
	methods: {
		// 路由跳转
		jump(path, parmas) {
			this.$Router.push({
				path: path,
				query: parmas
			});
		},
	}
};
</script>

<style lang="scss">
	// @import url('//at.alicdn.com/t/font_956911_py2eooakww9.css');
	.center-container{
		.center-top{
			height:320rpx;
			width:100%;
			background-size:cover;
			background-position:center center;
			background-image:url('https://shopro-1253949872.file.myqcloud.com/uploads/20200704/3fd138c2e95f80ecc11eebe312ffce94.png');
			
			&-title{
				height:80rpx;
				line-height:80rpx;
				text-align:center;
				font-size:32rpx;
				color:white;
			}
			
			.center-icons{
				display:flex;
				justify-content:space-between;
				align-items:center;
				height:240rpx;
				
				.center-icon{
					width:33%;
					text-align:center;
					color:white;
					
					.iconfont{
						font-size:70rpx;
						margin-bottom:10rpx;
					}
				}
			}
		}
	}
	
	.center-data{
		margin-top:15rpx;
		background-color:white;
		
		.block-title{
			height:50rpx;
			line-height:50rpx;
			border-left:solid 2px red;
			margin-left:10px;
			padding-left:10px;
			font-size:28rpx;
			font-weight:bold;
		}
		
		.block-items{
			display:flex;
			justify-content:space-between;
			flex-wrap:wrap;
			padding-top:30rpx;
			
			.block-item{
				width:50%;
				height:150rpx;
				display:inline-block;
				text-align:center;
				
				border:solid 1px rgb(246,246,246);
				
				&-title{
					font-size:24rpx;
					margin-top:30rpx;
				}
				&-num{
					font-weight:bold;
					margin-top:10rpx;
					font-size:32rpx;
					color:rgb(233,80,26);
				}
			}
		}
	}
	
	
	.center-data{
		
		&.grid-table{
			display:flex;
			flex-wrap:wrap;
			margin-bottom:95rpx;
			justify-content: space-around;
		}
		
		.grid-item{
			display:inline-block;
			width:24%;
			height:180rpx;
			text-align:center;
			
			.iconfont{
				margin-top:40rpx;
				margin-bottom:15rpx;
				font-size:50rpx;
			}
			
			&-empty{
				width:24%;
				display:inline-block;
				height:1px;
			}
		}
	}
	
	.footer{
		position:fixed;
		left:0px;
		right:0px;
		bottom:0px;
		
		background-color:white;
		height:90rpx;
		border-top:solid 1px rgb(240,240,240);
		display:flex;
		justify-content:space-between;
		align-items:center;
		
		.footer-item{
			display:inline-block;
			width:50%;
			text-align:center;
			font-size:28rpx;
			
			.iconfont{
				margin-top:5rpx;
				font-size:36rpx;
			}
			
		}
	}
</style>




